<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>vue06 style绑定</title>
	<style type="text/css">
		 *{}
	</style>
</head>
<body>
<!--<div class="box" id="box" v-bind:style="{color:activeColor,fontSize:fontSize+'px',width:width,height:height,backgroundColor:backgroundColor}"></div>-->
<div class="box" id="box" v-bind:style="[styleData,styleData1]"></div>
	
</body>
<script src="js/vue.js"></script>
<script>
	(function(){
		"use strict";
		var vm = new Vue({
			el: "#box",
			data:{
				styleData:{
					Color:'#CCC',
			    	fontsize:30,
				    width:'100px',
				    height:'00px',
				    backgroundColor:'red'
				},
				styleData1:{
				    width:'500px',
				    height:'400px',
				    transform: 'translateY(100px)',
				    transition: '1s all',
				    backgroundColor:'green'
				}
			}
		})

	})()
</script>
</html>